var wxCharts = require('../../utils/wxcharts.js');
var app = getApp();
var totalCount = null;
var doneCount = null;
var todoCount = null;
var outtimeCount = null;
Page({
  data: {
    totalCountChart: {
      title: '10个',
      subtitle: '所有待办',
      count: 10
    },
    doneCountChart: {
      title: '2个',
      subtitle: '已完成',
      count: 2
    },
    todoCountChart: {
      title: '5个',
      subtitle: '待完成',
      count: 5
    },
    outtimeCountChart: {
      title: '3个',
      subtitle: '超期',
      count: 3
    }
  },
  touchHandler: function (e) {
    console.log(totalCount.getCurrentDataIndex(e));
  },
  onReady: function (e) {
    var windowWidth = 320;
    try {
      var res = wx.getSystemInfoSync();
      windowWidth = res.windowWidth;
    } catch (e) {
      console.error('getSystemInfoSync failed!');
    }

    // 所有待办
    totalCount = new wxCharts({
      animation: true,
      canvasId: 'totalCount',
      type: 'ring',
      extra: {
        ringWidth: 20,
        pie: {
          offsetAngle: -45
        }
      },
      title: {
        name: this.data.totalCountChart.title,
        color: '#337ab7',
        fontSize: 25
      },
      subtitle: {
        name: this.data.totalCountChart.subtitle,
        color: '#666666',
        fontSize: 15
      },
      series: [{
        name: this.data.totalCountChart.subtitle,
        data: this.data.totalCountChart.count,
        stroke: false,
        color: '#337ab7' 
      }],
      disablePieStroke: true,
      width: windowWidth,
      height: 200,
      dataLabel: false,
      legend: false,
      background: '#f5f5f5',
      padding: 0
    });
    // 已完成
    doneCount = new wxCharts({
      animation: true,
      canvasId: 'doneCount',
      type: 'ring',
      extra: {
        ringWidth: 20,
        pie: {
          offsetAngle: -45
        }
      },
      title: {
        name: this.data.doneCountChart.title,
        color: '#5cb85c',
        fontSize: 25
      },
      subtitle: {
        name: this.data.doneCountChart.subtitle,
        color: '#666666',
        fontSize: 15
      },
      series: [{
        name: this.data.doneCountChart.subtitle,
        data: this.data.doneCountChart.count,
        stroke: false,
        color: '#5cb85c'
      }],
      disablePieStroke: true,
      width: windowWidth,
      height: 200,
      dataLabel: false,
      legend: false,
      background: '#f5f5f5',
      padding: 0
    });
    // 未完成
    todoCount = new wxCharts({
      animation: true,
      canvasId: 'todoCount',
      type: 'ring',
      extra: {
        ringWidth: 20,
        pie: {
          offsetAngle: -45
        }
      },
      title: {
        name: this.data.todoCountChart.title,
        color: '#f0ad4e',
        fontSize: 25
      },
      subtitle: {
        name: this.data.todoCountChart.subtitle,
        color: '#666666',
        fontSize: 15
      },
      series: [{
        name: this.data.todoCountChart.subtitle,
        data: this.data.todoCountChart.count,
        stroke: false,
        color: '#f0ad4e'
      }],
      disablePieStroke: true,
      width: windowWidth,
      height: 200,
      dataLabel: false,
      legend: false,
      background: '#f5f5f5',
      padding: 0
    });
    // 超期
    outtimeCount = new wxCharts({
      animation: true,
      canvasId: 'outtimeCount',
      type: 'ring',
      extra: {
        ringWidth: 20,
        pie: {
          offsetAngle: -45
        }
      },
      title: {
        name: this.data.outtimeCountChart.title,
        color: '#c9302c',
        fontSize: 25
      },
      subtitle: {
        name: this.data.outtimeCountChart.subtitle,
        color: '#666666',
        fontSize: 15
      },
      series: [{
        name: this.data.outtimeCountChart.subtitle,
        data: this.data.outtimeCountChart.count,
        stroke: false,
        color: '#c9302c'
      }],
      disablePieStroke: true,
      width: windowWidth,
      height: 200,
      dataLabel: false,
      legend: false,
      background: '#f5f5f5',
      padding: 0
    });
    setTimeout(() => {
      totalCount.stopAnimation();
    }, 500);
  },
  /**
   * 打赏 
   */
  btnTapToPay(e) {
    wx.requestPayment({
      timeStamp: Date.parse(new Date()).toString(),
      nonceStr: Date.parse(new Date()).toString(),
      package: '',
      signType: 'MD5',
      paySign: '',
      success(res) { },
      fail(res) { }
    })
  }
});